<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>03_分区元素</title>
</head>
<body>
    再有三天就是<span style="color:orange;">端午节</span>了，你准备好了吗
    <!-- 要求：小可爱-红色 JSDTN2503-绿色 第三阶段-蓝色-->
    欢迎各位<span style="color: red;">小可爱</span>
    进入<span style="color: green;">JSDTN2503</span>
    班级的<span style="color: blue;">第三阶段</span>学习！
    <hr>
    <!-- 行内元素：可以与其他元素共处一行   -->
    <span>我是span</span>
    <span>我是span</span>
    <span>我是span</span>
    <!-- 块级元素：独占一行(父级宽度的100%)   -->
    <div>我是div</div>
    <div>我是div</div>
    <div>我是div</div>
    <hr>
    <div class="header">我是顶部条</div>
    <div class="nav">我是导航栏</div>
    <div class="main">我是主体内容</div>
    <div class="footer">我是尾部</div>
    <div class="section">我是区块 </div>
    <div class="article">我是文章</div>
    <div class="aside">我是侧边栏</div>
    <hr>
    <header>我是顶部条</header>
    <nav>我是导航栏</nav>
    <main>我是主体内</main>
    <footer>我是尾部</footer>
    <section>我是区块</section>
    <article>我是文章</article>
    <aside>我是侧边栏</aside>
</body>
</html>